<template>
	<view class="success-con">
		<view class="image-icon">
			<image src="/static/lh/equity/shop_1.png" style="width: 98rpx" mode="widthFix"></image>
		</view>
		<view class="success-title">购买成功</view>
		<view class="success-vip">学王课堂VIP省心会员</view>
		<view class="success-detail">（ 权益已发放至账号绑定的手机号 {{ mobile }} )</view>
		<view class="btnOk">
			<button class="btn-class" @click="closeBtn">确 定</button>
		</view>
	</view>
</template>

<script setup>
const props = defineProps({
	mobile: {
		type: String,
		default: ""
	}
});
const emit = defineEmits(['btnOk']);

const closeBtn = ()=>{
	emit('btnOk')
}
</script>

<style lang="scss" scoped>
.success-con {
	width: 546rpx;
	height: 550rpx;
	background: #ffffff;
	border-radius: 28rpx;
	.btnOk{
		text-align: center;
		// margin: 0 auto;
		display: flex;
		justify-content: center;
		margin-top: 62rpx;
		.btn-class{
			width: 326rpx;
			height: 80rpx;
			background: #3477FC;
			box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(33,100,233,0.59);
			border-radius: 40rpx;
			line-height: 80rpx;
			
			font-weight: 800;
			font-size: 40rpx;
			color: #FFFFFF;
		}
	}
	.image-icon {
		text-align: center;
		margin-top: 33rpx;
		margin-bottom: 44rpx;
	}
	.success-title {
		height: 44rpx;
		font-family: PingFang SC;
		font-weight: 800;
		font-size: 46rpx;
		color: #161616;
		text-align: center;
	}
	.success-vip {
		height: 27rpx;
		font-family: PingFang SC;
		font-weight: bold;
		font-size: 28rpx;
		color: #2a2a2a;
		text-align: center;
		margin-top: 46rpx;
	}
	.success-detail {
		height: 21rpx;
		font-family: PingFang SC;
		font-weight: 400;
		font-size: 22rpx;
		color: #474747;
		text-align: center;
		margin-top: 18rpx;
	}
}
</style>
